//创建一个路由器，并暴露出去

//第一步：引入createRouter
import { createRouter, createWebHistory } from 'vue-router';
//引入一个个可能呈现的组件
import Home from "../pages/Home.vue";
import News from "../pages/News.vue";
import About from "../pages/About.vue";
import Contact from "../pages/Detail.vue";
import Detail from '../pages/Detail.vue';
//第二步：创建路由器
const router = createRouter({
        history:createWebHistory(),//路由器的工作模式
    routes:[//一个个的路由规则
        {
            path:'/home',
            component:Home
        },
        {
            name:'news',
            path:'/news',
            component:News,
            children:[
                {
                    name:'detail',
                    path:'detail',//加上问号变成可传可不传，配置参数必要性
                    component:Detail,
                    //第一种写法：将路由收到的所有params参数作为props传给路由组件
                    // props:true,

                    // 第二种写法：函数写法，可以自己决定将什么作为props给路由组件
                    props(route){
                        return route.query
                    }

                    //第三种写法：对象写法，只能写成定值
                    // props:{
                    //     a:100,
                    //     b:200,
                    //     c:300
                    // }
                }
            ]
        },
        {
            path:'/about',
            component:About
        },
        {//重定向，让指定的路径定位到另一个向
            path:'/',
            redirect:'/home'
        }
    ]
})

export default router;